<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>日期</title>
  <style>
    body {
      background: #000;
      color: #fff;
      font-size: 50px;
      padding-top: 100px;
      text-align: center;
    }
  </style>
</head>

<body>
  <h1></h1>
  <script>

    const h1 = document.querySelector('h1');
    setInterval(() => {
      h1.innerHTML = getFullDay(new Date());
    }, 1000);


    // let date = new Date(2022, 6, 10);//是个对象  toString()'Sun Jul 10 2022 00:00:00 GMT+0800 (中国标准时间)'
    // console.log(date);//
    // console.log(date.getDay());
    // const str = 'Sun Jul 10 2022 00:00:00 GMT+0800 (中国标准时间)'
    // console.log(str.getDay());

    /**
     * @description: 来根据某个日期返回这一天是星期几
     * @return {*}  '星期X'
     * @param {*} date  时间对象
     */
    function getWeek(date) {
      // date.getDay() // 0- 6
      /*       if (date.getDay() == 0) {
              return '星期日'
            } else if (date.getDay() == 1) {
              return '星期一'
            } */

      /*       switch (date.getDay()) {
              case 0:
                return '星期日'
              case 1:
                return '星期一'
              case 2:
                return '星期二'
              case 3:
                return '星期三'
              case 4:
                return '星期四'
              case 5:
                return '星期五'
              case 6:
                return '星期六'
            } */

      const arr = ["日", "一", "二", "三", "四", "五", "六"]
      return '星期' + arr[date.getDay()]
    }
    // console.log(getWeek(new Date(2022, 6, 10)));


    /**
     * @description: 把月、日、小时等出现个位数的情况前面补充 0 ，补充为两位，比如 1 变为 01
     * @return {*}   '01'
     * @param {*} num  一个1或2位的数字
     */
    function addZero(num) {
      return num < 10 ? '0' + num : num + ''
    }
    // console.log(addZero('2'));
    // console.log(addZero(12));



    /**
     * @description: 判断年份是否为闰年，
     * @return {*} 返回布尔值
     * @param {*} year 要判断的年份数字
     */
    function isLeapYear(year) {
      if (year % 400 === 0 || (year % 100 !== 0 && year % 4 === 0)) {
        return true
      } else {
        return false
      }
    }
    // console.log(isLeapYear(2004));

    /**
     * @description: 获取年份
     * @return {*}
     * @param {*} date
     */
    function getYear(date) {
      return date.getFullYear()
    }
    // console.log(getYear(new Date()));


    /**
     * @description: 获取月份
     * @return {*}
     * @param {*} date
     */
    function getMonth(date) {
      return date.getMonth() + 1
    }
    // console.log(getMonth(new Date()));

    /**
     * @description: 获取日
     * @return {*}
     * @param {*} date
     */
    function getDay(date) {
      return date.getDate()
    }
    // console.log(getDay(new Date()));

    /**
     * @description: 获取小时
     * @return {*}
     * @param {*} date
     */
    function getHour(date) {
      return date.getHours()
    }
    // console.log(getHour(new Date()));

    /**
     * @description: 获取分钟
     * @return {*}
     * @param {*} date
     */
    function getMinute(date) {
      return date.getMinutes()
    }
    // console.log(getMinute(new Date()));


    /**
     * @description: 获取秒
     * @return {*}
     * @param {*} date
     */
    function getSecond(date) {
      return date.getSeconds()
    }
    // console.log(getSecond(new Date()));

    /**
     * @description: 获取毫秒
     * @return {*}
     * @param {*} date
     */
    function getMillisecond(date) {
      return date.getMilliseconds()
    }
    // console.log(getMillisecond(new Date()));


    /**
     * @description: 获取完整时间
     * @return {*}
     * @param {*} date
     */
    function getFullDay(date) {
      return `${getYear(date)}年 ${addZero(getMonth(date))}月${addZero(getDay(date))}日 ${getWeek(date)} ${addZero(getHour(date))}:${addZero(getMinute(date))}:${addZero(getSecond(date))}`
    }
    // console.log(getFullDay(new Date(2022, 6, 6, 6, 6, 6, 6)));
  </script>
</body>

</html>